import styles from "./index.module.less"
import { IconDelimiter } from "@codexteam/icons"

class Divider {
	static get toolbox() {
		return {
			title: "Divider",
			icon: IconDelimiter,
		}
	}
	static get isReadOnlySupported() {
		return true
	}

	constructor({ data, api, config, readonly }) {
		this.data = {
			color: data.color || "",
		}
		this.api = api
		this.readonly = readonly
		this.config = config || {}
		this.wrapper = undefined
	}

	render() {
		this.wrapper = document.createElement("div")
		this.wrapper.classList.add(styles["cx-custom-divider"])
		if (this.data && this.data.color) {
			this.wrapper.style.borderColor = color
		}
		return this.wrapper
	}
	save(blockContent) {
		return this.data
	}
}
export default Divider
